<template>
  <div class="my-person">
    <div class="my-bg">
      <span v-if="phone" class="f16 fff my-text">{{ phone }}</span>
      <router-link v-else class="f16 fff my-text" to="/account/login"
        >立即登录</router-link
      >
    </div>
    <div class="my-top">
      <van-cell
        v-for="item in topList"
        :title="item.title"
        :to="item.path"
        :key="item.title"
        is-link
      />
    </div>
    <Footer></Footer>
  </div>
</template>

<script>
import Footer from "@/components/Footer.vue";
import { mapState } from "vuex";
import {topListData} from './personData'
export default {
  data() {
    return {
      topList: topListData
    };
  },
  //注册组件
  components: {
    Footer,
  },
  computed: {
    ...mapState(["phone"]),
  },
};
</script>

<style lang="less" scoped>
.my-bg {
  width: 100%;
  height: 170px;
  background: url("../../../assets/img/bg2.78d35cdc.png") no-repeat;
  position: relative;
  .my-text {
    position: absolute;
    top: 20px;
    left: 20px;
  }
}
.my-top {
  margin-top: 12px;
}
</style>
